<template>
  <th
    v-for="(r, i) in rowAttrs"
    :key="`rowAttr${i}`"
    :colSpan="i === rowAttrs.length - 1 && rowAttrs.length !== 0 ? 2 : 1"
    class="pvtAxisLabel"
  >
    {{ getText(r) }}
  </th>
</template>

<script setup>
const props = defineProps({
  rowAttrs: {
    type: Array,
    required: true
  },
  rowTotal: {
    type: Boolean,
    required: true
  },
  colAttrsLength: {
    type: Number,
    required: true
  },
  localeStrings: {
    type: Object,
    required: true
  },
  fields: {
    type: Array,
    default: () => []
  },
  groupMode: {
    type: String,
    default: 'default',
  },
})

const getText = (text) => {
  // if (props.groupMode === 'dropdown') {
  //   return '';
  // }
  const item = props.fields.find(x => x.codeName === text);
  if (item) {
    return item.caption;
  }
  return text;
};
</script>
